<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html>
<html class="no-js">
<!--主页-->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
	
    <!--360 browser -->
    <meta name="renderer" content="webkit">
    <meta name="author" content="wos">
    <!-- Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <link rel="icon" sizes="192x192" href="<c:url value="/qianduan/images/i/app.png"></c:url>">
    <!--Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <link rel="apple-touch-icon-precomposed" href="<c:url value="/qianduan/images/i/app.png"></c:url>">
    <!--Win8 or 10 -->
    <meta name="msapplication-TileImage" content="<c:url value="/qianduan/images/i/app.png"></c:url>">
    <meta name="msapplication-TileColor" content="#e1652f">

    <link rel="icon" type="image/png" href="<c:url value="/qianduan/images/i/favicon.png"></c:url>">
    <link rel="stylesheet" href="<c:url value="/qianduan/assets/css/amazeui.css"></c:url>">
    <link rel="stylesheet" href="<c:url value="/qianduan/css/public.css"></c:url>">

    <!--[if (gte IE 9)|!(IE)]><!-->
    <script src="<c:url value="/qianduan/assets/js/jquery.min.js"></c:url>"></script>
    <!--<![endif]-->
    <!--[if lte IE 8 ]>
    <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
    <script src="assets/js/amazeui.ie8polyfill.min.js"></script>
    <![endif]-->
    <script src="<c:url value="/qianduan/assets/js/amazeui.min.js"></c:url>"></script>
    <script src="<c:url value="/qianduan/js/public.js"></c:url>"></script>
    <script src="<c:url value="/qianduan/js/jquery-3.1.0.min.js"></c:url>"></script>
   
</head>
<body>

<header class="am-topbar am-topbar-fixed-top wos-header">
    <div class="am-container">
        <h1 class="am-topbar-brand">
            <a href="#"><img src="<c:url value="/qianduan/images/logo.png"></c:url>" alt=""></a>
        </h1>

        <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-warning am-show-sm-only"
                data-am-collapse="{target: '#collapse-head'}">
            <span class="am-sr-only">导航切换</span>
            <span class="am-icon-bars"></span>
        </button>

        <div class="am-collapse am-topbar-collapse" id="collapse-head">
            <ul class="am-nav am-nav-pills am-topbar-nav">
                <li class="am-active"><a href="<c:url value='/main/toIndex'></c:url>">首页</a></li>
                <li><a href="<c:url value='/main/toForum?pageId=1'></c:url>">话题列表</a></li>
                <li><a href="<c:url value="/fileSource/getFilesourceList?type=1&pageId=1"></c:url>">资料下载</a></li>
                <li><a href="<c:url value='/index/toImage?pageIndex=1'></c:url>">图片墙</a></li>
                <li><a href="#">个人信息</a></li>
            </ul>
			
            <div class="am-topbar-right">
                <a href="<c:url value='/index/logout'></c:url>" class="am-btn am-btn-default am-topbar-btn am-btn-sm"><span class="am-icon-pencil">注销</span></a>
            </div>

           <div class="am-topbar-right">
                <button class="am-btn am-btn-danger am-topbar-btn am-btn-sm"><span class="am-icon-user"></span> ${currentUser.name}</button>
            </div>
        </div>
    </div>
</header>

<!--banner-->
<div class="banner">
    <div class="am-g am-container">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-8">
            <div data-am-widget="slider" class="am-slider am-slider-c1" data-am-slider='{"directionNav":false}' >
                <ul class="am-slides">
                    <li>
                        <img src="<c:url value="/qianduan/Temp-images/1.jpg"></c:url>">
                        <div class="am-slider-desc">远方 有一个地方 那里种有我们的梦想</div>
                    </li>
                    <li>
                       <img src="<c:url value="/qianduan/Temp-images/2.jpg"></c:url>">
                        <div class="am-slider-desc">某天 也许会相遇 相遇在这个好地方</div>
                    </li>
                    <li>
                        <img src="<c:url value="/qianduan/Temp-images/3.jpg"></c:url>">
                        <div class="am-slider-desc">不要太担心 只因为我相信 终会走过这条遥远的道路</div>

                    </li>
                    <li>
                        <img src="<c:url value="/qianduan/Temp-images/4.jpg"></c:url>">
                        <div class="am-slider-desc">我们陪着你一起探索</div>
                    </li>
                </ul>
            </div>
        </div>
        <div class="am-u-sm-0 am-u-md-0 am-u-lg-4 padding-none">
            <div class="star am-container"><span>靓丽风景</span></div>
            <ul class="padding-none am-gallery am-avg-sm-2 am-avg-md-4 am-avg-lg-2 am-gallery-overlay" data-am-gallery="{ pureview: true }" >
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/1.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/2.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/3.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/4.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/4.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
                <li>
                    <div class="am-gallery-item">
                        <a href="#">
                            <img src="<c:url value="/qianduan/Temp-images/4.jpg"></c:url>"  alt="美女"/>
                            <div class="am-gallery-desc">2375-09-26</div>
                        </a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>

<div class="am-g am-container newatype">
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-8 oh">
        <div data-am-widget="titlebar" class="am-titlebar am-titlebar-default" style="border-bottom: 0px; margin-bottom: -10px">
            <h2 class="am-titlebar-title ">
                最新主题
            </h2>
            <nav class="am-titlebar-nav">
                <a href="#more">more &raquo;</a>
            </nav>
        </div>

        <div data-am-widget="list_news" class="am-list-news am-list-news-default news">
            <div class="am-list-news-bd" id="news-div">
                <ul id="news-list" class="am-list">
					<c:forEach items="${newTopicList}" var="topic" varStatus="status">
						
						<li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left" data-am-scrollspy="{animation:'fade'}">
	                        <div class="am-u-sm-4 am-list-thumb" >
		                            <a href="<c:url value='/main/toTopicShow?topicid=${topic.id}&pageId=1'></c:url>">
		                                <c:if test="${topic.type == 0 }">
		                                	<img src="<c:url value="/qianduan/images/置顶图标.jpg"></c:url>" />
		                                </c:if>
		                                <c:if test="${topic.type == 1 }">
		                                	<img src="<c:url value="/qianduan/images/精华图标.jpg"></c:url>" />
		                                </c:if>
		                                <c:if test="${topic.type == 2 }">
		                                	<img src="<c:url value="/qianduan/images/最新图标.png"></c:url>" />
		                                </c:if>
		                            </a>
		                     </div>
	                        <div class=" am-u-sm-7 am-list-main">
	                            <h2 class="am-list-item-hd"><a href="<c:url value='/main/toTopicShow?topicid=${topic.id}&pageId=1'></c:url>">${topic.title} ----作者:${topic.name}</a></h2>
	                        </div>
	                    </li>
	                    <div class="newsico am-fr">
	                        <i class="am-icon-clock-o">${topic.posttime}</i>
	                        <%-- <i class="am-icon-hand-pointer-o">${topic.replycount}</i> --%>
	                    </div>
					</c:forEach>
                </ul>
            </div>


            <div class="am-hide-sm">
                <div data-am-widget="titlebar" class="am-titlebar am-titlebar-default">
                    <h2 class="am-titlebar-title ">
                       	 热门图片
                    </h2>
                    <nav class="am-titlebar-nav">
                		<a href="#more">more &raquo;</a>
            		</nav>
                </div>


                <div id="youxi" class="case am-animation-slide-left">
                    <ul class="am-gallery am-avg-sm-2 am-avg-md-4 am-avg-lg-4 am-gallery-overlay" data-am-gallery="{ pureview: true }" >
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                    <img alt="" src="<c:url value="/imageqiang/images/1.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                   <img alt="" src="<c:url value="/imageqiang/images/2.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                    <img alt="" src="<c:url value="/imageqiang/images/3.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                   <img alt="" src="<c:url value="/imageqiang/images/4.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                    <img alt="" src="<c:url value="/imageqiang/images/5.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                    <img alt="" src="<c:url value="/imageqiang/images/6.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                    <img alt="" src="<c:url value="/imageqiang/images/7.jpg"></c:url>"> 
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="am-gallery-item">
                                <a href="<c:url value="/qianduan/Temp-images/02.jpg"></c:url>">
                                   <img alt="" src="<c:url value="/imageqiang/images/8.jpg"></c:url>">
                                    <div class="am-gallery-desc">2375-09-26</div>
                                </a>
                            </div>
                        </li>
                        
                        
                    </ul>
                </div>

               


                
            </div>
        </div>
    </div>
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-4">
        <div data-am-widget="titlebar" class="am-titlebar am-titlebar-default">
            <h2 class="am-titlebar-title ">
                热门话题
            </h2>
            <nav class="am-titlebar-nav">
                <a href="#more">more &raquo;</a>
            </nav>
        </div>
        <div data-am-widget="list_news" class="am-list-news am-list-news-default right-bg" data-am-scrollspy="{animation:'fade'}">
                <ul class="am-list"  >
                    
                    <c:forEach items="${hotForumList}" var="forum" varStatus="status">
	                    <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
		                        <div class="am-u-sm-4 am-list-thumb">
		                            <a href="<c:url value='/main/toPersonalTopic?pageId=1&forumid=${forum.id}'></c:url>">
		                                <img src="<c:url value="/qianduan/Temp-images/2.jpg"></c:url>" class="face"/>
		                            </a>
		                        </div>
		
		                        <div class=" am-u-sm-8 am-list-main">
		                            <h1 class="am-list-item-hd"><a href="<c:url value='/main/toPersonalTopic?pageId=1&forumid=${forum.id}'></c:url>">${forum.name }</a></h1>
		
		                            <div class="am-list-item-text">${forum.description}</div>
		                        </div>
		                    </li>
		                    <hr data-am-widget="divider" style="" class="am-divider am-divider-default" />
                    </c:forEach>
	                    
                    
                </ul>
        </div>

        <div data-am-widget="titlebar" class="am-titlebar am-titlebar-default">
            <h2 class="am-titlebar-title ">
                	热门主题
            </h2>
            <nav class="am-titlebar-nav">
                <a href="#more">more &raquo;</a>
            </nav>
        </div>

        <div data-am-widget="list_news" class="am-list-news am-list-news-default right-bg" data-am-scrollspy="{animation:'fade'}">
            <ul class="am-list">
            
            <c:forEach items="${hotTopicList}" var="topic" varStatus="status">
            	 <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
                    <div class="am-u-sm-4 am-list-thumb">
                        <a href="<c:url value='/main/toTopicShow?topicid=${topic.id}&pageId=1'></c:url>">
                            <img src="<c:url value="/qianduan/Temp-images/2.jpg"></c:url>" class="face"/>
                        </a>
                    </div>

                    <div class=" am-u-sm-8 am-list-main">
                        <h2 class="am-list-item-hd"  ><a href="<c:url value='/main/toTopicShow?topicid=${topic.id}&pageId=1'></c:url>">${topic.title}</a></h2>
                    </div>
                </li>
                <hr data-am-widget="divider" style="" class="am-divider am-divider-default" />        	
            </c:forEach>
            </ul>
        </div>
    </div>
</div>

<div data-am-widget="gotop" class="am-gotop am-gotop-fixed" >
    <a href="#top" title="回到顶部">
        <span class="am-gotop-title">回到顶部</span>
        <i class="am-gotop-icon am-icon-chevron-up"></i>
    </a>
</div>

<footer>
    <div class="content">
        <ul class="am-avg-sm-5 am-avg-md-5 am-avg-lg-5 am-thumbnails">
            <li><a href="#">联系我们</a></li>
            <li><a href="#">加入我们</a></li>
            <li><a href="#">合作伙伴</a></li>
            <li><a href="#">广告及服务</a></li>
            <li><a href="#">友情链接</a></li>
        </ul>
        <p>© 2016 AllMobilize, Inc. Licensed under MIT license. Developed with WebStorm.</p>

    </div>
</footer>
</body>
</html>